import React,{useState} from 'react';
import { useNavigate } from 'react-router-dom';
import { DatePicker,Form,Input,Button,Card ,notification,message, Select,Tree  } from 'antd';
import { checkin_add } from '../../../../api/checkApi/api'
function AddCheck(props) {
    const [form] = Form.useForm();
    const { Option } = Select;
    var ngvigate = useNavigate()
    const config = {
        rules: [
          {
            type: 'object',
            required: true,
            message: 'Please select time!',
          },
        ],
      };
      var [time, setTime] = useState([])
      var change = (value) => {
        console.log(value);
        setTime(value)
      }
      var [time2, setTime2] = useState({})
      var change2 = (value) => {
        console.log(value);
        setTime2(value)
      } 
    const onFinish = (values)=>{
        console.log(values);
        if(values.name == '' || values.num == '' || values.type == '' || values.people == '' || values.time == '' || values.updatetime == ''){
          notification.error({message:'有信息未输入'})
        }else{
          checkin_add({name:values.name,num:values.num,type:values.type,people:values.people,time:time.$y + '-' + (time.$M + 1) + '-' + time.$D,updatetime: time2.$y + '-' + (time2.$M + 1) + '-' + time2.$D + ' ' + time2.$H + ' : ' + time2.$m}).then((res)=>{
            console.log(res.data);
          })
          notification.success({message:'考勤管理信息添加成功'})
          ngvigate('/index/checknav/check')
        }
    }
    const onGenderChange = (value) => {
        console.log(value);
        
      };
    return (
        <div className='addcheck'>
             <Card>
                <Form
                 labelCol={{ span: 6 }}
                 wrapperCol={{ span: 8 }}
                 onFinish={onFinish}
                 form={form}
                 >
    
                     <Form.Item
                         label="考勤组名称"
                         name="name"
                         rules={[{ required: true, message: '输入考勤组名称' }]}
                     >
                         <Input placeholder='输入考勤组名称'/>
                     </Form.Item>
                     <Form.Item
                         label="考勤组人数"
                         name="num"
                         rules={[{ required: true, message: '输入人数' }]}
                     >
                         <Input type='number' placeholder='输入人数'/>
                     </Form.Item>
                     <Form.Item
                         label="考勤组类型"
                         name="type"
                         rules={[{ required: true, message: '' }]}
                     >
                        <Select
                          placeholder="Select a option"
                          allowClear
                          onChange={onGenderChange}
                        >
                          <Option value="固定班制">固定班制</Option>
                          <Option value="排班制">排班制</Option>
                          <Option value="自由班制">自由班制</Option>
                        </Select>
                     </Form.Item>
                     <Form.Item
                         label="负责人"
                         name="people"
                         rules={[{ required: true, message: '输入负责人名称' }]}
                     >
                         <Input placeholder='输入负责人名称'/>
                     </Form.Item>
                    <Form.Item name="time" label="添加默认班次时间" {...config}>
                      <DatePicker onChange={change} />
                    </Form.Item>
                    <Form.Item name="updatetime" label="添加更新时间" {...config}>
                      <DatePicker showTime format="YYYY-MM-DD HH:mm:ss" onChange={change2} />
                    </Form.Item>
    
                     <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
                         <Button type="primary" htmlType="submit">提交</Button>
                     </Form.Item>
                 </Form>
                </Card>
                
        </div>
    );
}

export default AddCheck;